console.log('main.js starting...')

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import 'cesium/Source/Widgets/widgets.css'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import axios from './api/axios'

try {
  
  console.log('All imports successful')
  
  const app = createApp(App)
  
  console.log('Vue app created successfully')
  
  // 事件总线实现
  function createEventBus() {
    const listeners = {}
    
    return {
      $on: (event, callback) => {
        if (!listeners[event]) {
          listeners[event] = []
        }
        listeners[event].push(callback)
      },
      $emit: (event, ...args) => {
        if (listeners[event]) {
          listeners[event].forEach(callback => callback(...args))
        }
      },
      $off: (event, callback) => {
        if (listeners[event]) {
          if (callback) {
            const index = listeners[event].indexOf(callback)
            if (index > -1) {
              listeners[event].splice(index, 1)
            }
          } else {
            listeners[event] = []
          }
        }
      }
    }
  }
  
  console.log('Event bus created')
  
  // 全局属性注册
  app.config.globalProperties.$axios = axios
  app.config.globalProperties.$bus = createEventBus()
  
  console.log('Global properties registered')
  
  // 插件注册
  app.use(ElementPlus)
  console.log('ElementPlus registered')
  
  app.use(router)
  console.log('Router registered')
  
  console.log('Vue app mounting...')
  app.mount('#app')
  console.log('Vue app mounted successfully')
  
} catch (error) {
  console.error('Error during app initialization:', error)
  document.body.innerHTML = '<div style="color: red; font-size: 20px; padding: 20px;">Error: ' + error.message + '</div>'
}